﻿/*
Description: 方便快捷的内容管理系统，安全快速的数据处理，简单明了的后台操作，让您快速搭建自己的网站！
Version: 1.0
Author: 郑州云启软件科技有限公司
Author URI: http://www.zzyunqi.com/
*/
html, body, ul, li, ol, dl, dd, dt, p, h1, h2, h3, h4, h5, h6, form, fieldset, legend, img { margin: 0; padding: 0; }
fieldset, img { border: none; }
img { display: block; width: 100%; }
address, caption, cite, code, dfn, th, var { font-style: normal; font-weight: normal; }
ul, ol { list-style: none; }
input { padding-top: 0; padding-bottom: 0; font-family: "Microsoft YaHei", "SimSun"; }
input::-moz-focus-inner {
border:none;
padding:0;
}
select, input { vertical-align: middle; }
select, input, textarea { font-size: 12px; margin: 0; text-align: left; }
input[type="text"], input[type="password"], textarea { outline-style: none; -webkit-appearance: none; text-align: right; }
i { color: #FFF; font-family: "iconfont" !important; font-weight: normal; font-style: normal; font-size: 16px; }
textarea { resize: none; }
body { color: #333; padding: 0; font: 14px "Microsoft YaHei", "SimSun", "Arial  Narrow", HELVETICA; background: url(../img/paper-bg.jpg); }
.f_l { float: left; }
.f_r { float: right; }
.clear { clear: both; }
a { text-decoration: none; outline: none; blr:expression(this.onFocus=this.blur());
}
.tbody { width: 1200px; margin: 0 auto; }
.section { border: 1px solid red; }
.tc_box { position: fixed; top: 20%; left: 30%; width: 500px; }
.tc_box img { width: 100%; }
.tc_box .closs_box { float: right; color: #FFF; font-size: 22px; line-height: 22px; }
/*********header***********/
.header { position: fixed; top: 0px; left: 0px; width: 100%; background-color: rgba(0,0,0,.7); height: 80px; z-index:888 }
.header .logo { float: left; width: 150px; margin-top: 8px; }
.header .nav { float: right; }
.header .nav li { float: left; }
.header .nav a { display:block; color: #fff; font-size: 14px; height: 80px; padding: 0 20px; text-shadow: none; background: none; line-height:80px;}
.header .nav a.cur{ background-color:#555;}
.header .nav a:hover{ background-color:#444;}
/**********banner***********/
.banner{ overflow:hidden; width:100%; position:fixed; top:0px; background-color:#000; z-index:-1}
.banner .left_btn,.banner .right_btn{ display:block; width:23px; position:absolute; top:45%; z-index:9; left:10%;}
.banner .right_btn{ left:auto; right:10%;}
.banner .sc_bd ul{ width:100%; height:100%;}
.banner .sc_bd li a{ display:block; width:100%; height:100%;}
.banner .sc_bd li{ width:100%; height:100%;}
.banner .sc_bd li img{ width:100%}
.banner .sc_hd{ position:absolute; bottom:100px; left:50%;}
.banner .sc_hd ul{ margin-left:-50%;}
.banner .sc_hd li{ background:url(../img/bottomnavoff.png) no-repeat top left; width:20px; height:20px; margin:0 10px; float:left;}
.banner .sc_hd li.cur{ background:url(../img/bottomnavon.png) no-repeat top left;}
/**********content***********/
.con_box{ height:500px; width:100%;}
.about{ background:url(../img/wallpaper2.jpg) 50% bottom; min-width:1200px;}
.title{ font-size:24px; text-align:center; line-height:60px; text-align:center; margin:0 auto; padding-top:20px;}
.ftitle{ font-size:14px; text-align:center; margin-top:10px; line-height:28px;}
.about_box{ overflow:hidden;}
.about_box ul{ margin-top:20px;}
.about_box li{ float:left; width:280px; margin:0 10px;}
.about_box li img{box-shadow: 0 0 14px #888888;}
.about_box .server_tit{ font-size:18px; line-height:36px; color:#333;}
.about_box .server_des{ font-size:12px; line-height:24px; color:#666; line-height:24px;}
.more{ display:block; width:150px; height:45px; border:1px solid #666; color:#666; text-align:center; line-height:45px; margin:40px auto 0; font-weight:bold; transition:all .3s}
.more:hover{ background-color:#333; color:#fff;}
.process{ background-color:#FFf; width:100%;}
.process .pro_con{ height:300px; background:url(../img/pro_con_bg.png) no-repeat center center;}
/*************case************/
.case_box ul{ margin-top:20px;}
.case_box li{ float:left; width:280px; height:180px; margin:10px 10px; position:relative; overflow:hidden;}
.case_box li .cove{ width:280px; height:180px; background-color:rgba(0,0,0,0.5); position:absolute; top: 0; left: 280px; filter:Alpha(opacity=50); }
.case_box li .case_tit{ text-align:center; font-size:16px; line-height:32px; color:#FFF; margin-top:80px;}
.case_box li .case_more{ display:block; margin:20px auto 0px; width:80px; height:32px; line-height:32px; font-size:14px; color:#b02d2e; font-weight:bold; border:2px solid #b03d2e; border-radius:4px; text-align:center;}
.case_box li .case_more:hover{ background-color:#b02d2e;}
.con_box2{height: 700px;background:url(../img/bg4.jpg) center top; margin-top:20px;}
.con_box2 ul{ width:1024px; margin:20px auto 0px;}
.con_box2 .title,.con_box2 .ftitle{ color:#FFF;}
.con_box2 li{ float:left;width: 482px;background: url(../img/bg5.png) center center;line-height: 64px;padding-left: 20px;float: left;font-size: 16px;margin-right: 10px;margin-bottom: 10px; color:#FFF;}
.news_box ul{ margin-top:20px;}
.news_box li{ float:left; width:48%; margin-right:2%; height:50px; border-bottom:1px dashed #333333;}
.news_box li a{ color:#333; font-size:16px; line-height:50px;}
.time{ float:right; line-height:50px;}
.news_ico{ width:5px; height:18px; background-color:#777; float:left; margin-top:16px; margin-right:8px;}
.f_bottom{ height:32px; width:100%; background-color:#111;}
.f_bottom p{ line-height:32px;}
.footer{ background-color:#000; margin-top:20px;}
.footer .erweima{ width:150px; float:right; margin-top:30px;}
.footer .erweima img{ width:150px; height:150px;}
.footer .erweima .er_con{ color:#FFF; font-size:12px; line-height:28px; text-align:center;}
.footer ul{ float:left; margin-right:80px; padding-right:90px; border-right:1px solid #666; margin-top:30px;}
.footer ul .f_tit{ font-size:16px; font-weight:bold; color:#fff; margin-bottom:8px;}
.footer ul li a{ font-size:14px; line-height:24px; color:#fff;}
.footer .f_link{ line-height:64px; height:64px; color:#aaa;}
.footer .f_link a{ color:#aaa; margin-right:8px;}
/******************************
 *        serverpage          *
 ******************************/
.fheader { position: fixed; top: 0px; left: 0px; width: 100%; background-color: rgba(0,0,0,.7); height: 80px; z-index:888 }
.fheader .logo { float: left; width: 150px; margin-top: 8px; }
.fheader .nav { float: right; }
.fheader .nav li { float: left; }
.fheader .nav a { display:block; color: #fff; font-size: 14px; height: 80px; padding: 0 20px; text-shadow: none; background: none; line-height:80px;}
.fheader .nav a.cur{ background-color:#555;}
.fheader .nav a:hover{ background-color:#444;}
.s_nav{ height:24px; line-height:24px; background-color:#FFF; border-bottom:1px solid #CCC; color:#666;}
.s_nav a{ color:#666; line-height:24px;} 
.fbanner{ width:1200px; margin:80px auto 0; height:350px; overflow:hidden;}
.server_img{ width:400px;}
.server_con{ width:700px;}
.server_boxl,.server_boxr{ background-color:#FFF; padding:20px 20px; border-bottom:1px solid #CCC;}
.server_boxl .server_img{ float:left;}
.server_boxl .server_con{ float:right; text-align:left;}
.server_boxr .server_img{ float:right; text-align:left;}
.server_boxr .server_con{ float:left;}
.server_tit{ font-size:24px; font-weight:bold; line-height:48px; margin-top:30px;}
.server_text{ font-size:16px; color:#333; line-height:32px; margin-top:30px;}
/******************************
 *        piclistpage         *
 ******************************/
.case_content{ background-color:#FFF;}
.con_left{ width:260px; float:left; border:1px solid #CCC; margin-top:20px;}
.con_left .tit{ font-size:18px; font-weight:bold; background-color:#efefef; border-bottom:1px dashed #fff; text-align:center; line-height:36px; color:#333;}
.con_left li{ border-bottom:1px dashed #eee; margin-left:10px;}
.con_left li a{ font-size:12px; line-height:24px; color:#333;}
.con_right{ float:right; width:930px;}
.con_right ul{ margin:10px;}
.tags{ width:850px; margin:20px auto 0px;}
.tags a{ display: inline-block;padding: 0px 8px; margin-right:10px;color: #333;border: 1px solid #333;border-radius: 8px;line-height: 16px;height: 16px; transition:all .3s;}
.tags a:hover{ background-color:#333; color:#fff;}
.case_con{ width:920px; float:right;}
.page{ float:right; margin:20px 24px;}
.page a{ display:block; float:left; height:24px; line-height:24px; padding-left:10px; padding-right:10px; border:1px solid #666; transition:all 0.2s; margin:0 5px; color:#333;}
.page a:hover{ background:#333; color:#FFf;}
.news_list ul{ margin-top:20px;}
.news_list li{ width:90%; margin:0 auto; height:50px; border-bottom:1px dashed #333333;}
.news_list li a{ color:#333; font-size:16px; line-height:50px;}
.con_right .author{ font-size:12px; color:#666; text-align:center;}
.con_text{ width:850px; margin:0 auto; font-size:14px; color:#333; line-height:28px; margin-top:20px;}
.nptext{ margin-top:20px; margin-bottom:20px; font-size:14px; color:#666; width:850px; float:right; margin-right:45px;}
.nptext a{ font-size:14px; color:#666;}
.nptext .next{ float:left;}
.nptext .prev{ float:right;}

.about_con .leftimg{ width:450px; height:420px; background:url(../img/about_leftimg.jpg) no-repeat center center; float:left; margin-right:80px;}
.about_con .righttext{ font-size:16px; line-height:38px; color:#333;}
.call_con{ width:800px; margin:0 auto;}
.call_con p{ font-size:16px; color:#333; line-height:38px;}
.call_ly{ width:870px; margin:0 auto; background-color:#666; color:#FFF; border-radius:10px; padding:0 100px; line-height:28px; padding-bottom:20px;}
.call_ly .title{ color:#FFF;}
.call_ly .name,.call_ly .phone,.call_ly .webtype{ width:150px; border:1px solid #CCC; height:24px; line-height:24px; text-align:left; font-size:12px; color:#333; border-radius:4px; margin-bottom:20px; margin-top:20px; vertical-align:middle}
.call_ly .name,.call_ly .phone{ margin-right:54px;}
.call_ly .text{ border:1px solid #CCC; border-radius:4px; vertical-align:top; text-align:left; color:#333; font-size:14px; line-height:28px; padding:10px;}
.call_ly .lysub{ display:block; width:200px; text-align:center; font-size:16px; color:#FFF; background-color:#666; border:1px solid #fff; border-radius:3px; line-height:32px; margin:20px auto 0; transition:all 0.3s;}
.call_ly .lysub:hover{ background-color:#FFF; color:#333;}
@media screen and (max-width: 800px){
.banner .sc_bd li img{ width:auto;}
.banner .left_btn, .banner .right_btn,.banner .sc_hd{ display:none;}
.header .nav_ico{ display:block; float:right; margin-right:15px; height:40px; width:40px; margin-top:10px; background:url(../img/menu_bg.png) no-repeat center center;}
.header .nav{ width:100%; margin-top:1px;}
.header .nav li{ width:100%; height:24px; line-height:24px; background-color:#222; float:none; border-top:1px solid #727272;border-bottom:1px solid #000;}
.header .nav li a{ height:24px; text-align:center; line-height:24px;}
.fheader .nav_ico{ display:block; float:right; margin-right:15px; height:40px; width:40px; margin-top:10px; background:url(../img/menu_bg.png) no-repeat center center;}
.fheader .nav{ width:100%; margin-top:1px;}
.fheader .nav li{ width:100%; height:24px; line-height:24px; background-color:#222; float:none; border-top:1px solid #727272;border-bottom:1px solid #000;}
.fheader .nav li a{ height:24px; text-align:center; line-height:24px;}
.fbanner{ width:100%; height:auto;margin: 60px auto 0;}
.server_boxl,.server_boxr{ width:46%; padding-left:2%; padding-right:2%; padding-bottom:10px; float:left;}
.server_con{ width:100%;}
.server_img{ width:100%;}
    .server_tit{ text-align:center;}
    /*.server_tit{ text-align:left;}*/
.server_boxl .server_con,.server_text{ text-align:center;}
.header{ height:60px;}
.logo{ width:20% !important; max-width:90px; margin-top:10px;}
.fheader{ height:60px;}
.tbody{ width:100% !important;}
.nav{ display:none;}
.about{ width:100% !important; height:auto !important; padding-bottom:15px; min-width:100% !important; background: url(../img/paper-bg.jpg) !important;}
.con_box2{ display:none !important;}
.about_box li{ width:46%; margin-left:2%; margin-right:2%;}
.case_box li{ width:46%; margin-left:2%; margin-right:2%;}
.case_box li .cove{ display:none;}
.news_box li{ width:100%;}
.news_box ul{ width:95%; margin:0 auto;}
.f_list{ display:none;}
.footer .f_link{ height:auto; line-height:24px;}
.footer .erweima{ margin:0 auto; float:none; padding-top:15px;}
.con_right{ width:68%;}
.case_box li{ border:2px solid #999; width:44%;}
.con_left{ width:30%;} 
.con_text{ width:90%; margin:0 auto;}
.nptext{ width:80%;}
.nptext .next,.nptext .prev{ float:none;}
.tags{ width:100%;}
}
@media screen and (max-width: 500px){
.con_left{ display:none;}
.case_content .case_box{ width:100%;}
.news_list{ width:100%;}
.news_list li{ width:100% !important;}
.case_content .case_box li{width:44% !important; float:left !important; height:200px !important; margin-left:2% !important; margin-right:2% !important;}
.about_con .leftimg{ display:none;}
.server_boxl, .server_boxr{ width:100%;}
.about_box li{ width:95%;  margin:0 auto;float: none; margin-bottom:15px;}
.case_box li{ width:95%; margin:0 auto; float: none; height:300px; border:2px solid #999; margin-bottom:10px; }
.about_box .server_tit{ text-align:center;}
}



